<%--
  Created by IntelliJ IDEA.
  User: 17675
  Date: 2025/5/23
  Time: 16:27
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>

<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>

<%
    String path = request.getContextPath();
    String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort() + path + "/";
%>
<html>
<head>
    <title>Title</title>
    <base href="<%=basePath%>">
    <link rel="stylesheet" href="https://cdn.bootcdn.net/ajax/libs/twitter-bootstrap/3.4.1/css/bootstrap.min.css" integrity="sha384-HSMxcRTRxnN+Bdg0JdbxYKrThecOKuH5zCYotlSAcp1+c8xmyTe9GYg1l9a69psu" crossorigin="anonymous">
</head>
<body>

<div class="container">
    <h1 style="text-align: center">用户管理系统</h1>

    <div class="row">
        <div class="col-md-3">当前用户为：${sessionScope.user}</div>

        <div class="col-md-6">
            <table class="table table-hover">
                <thread>
                    <tr><td>id</td><td>用户名</td><td>头像</td><td>操作</td></tr>
                </thread>
                <c:forEach items="${requestScope.users}" var="user">
                    <tr><td>${user.id}</td><td>${user.username}</td>
                        <td><img width="20px" src="${user.profile}"></td>
                        <td>
                            <button data-id="${user.id}" type="button" class="delete btn btn-primary">删除</button>
                            <a href="user/update?id=${user.id}" class="delete btn btn-primary">修改</a>
                        </td>
                    </tr>
                </c:forEach>

            </table>
        </div>

        <div class="col-md-3"></div>
    </div>
</div>

<%--给页面中 class 为 delete 的按钮绑定点击事件。--%>
<%--点击后弹出一个确认框。--%>
<%--如果用户点击确认，则读取当前按钮的 data-id 属性（代表用户 ID），然后用 $.get 向后端发送删除请求。--%>
<%--删除完成后页面跳转回 /user，刷新用户列表。--%>
<script src="https://cdn.bootcdn.net/ajax/libs/jquery/2.2.1/jquery.js"></script>
<script>
    $(".delete").click(function(){
        let flag = confirm("你确定要进行此操纵吗？");
        if(flag){
            let id = $(this).attr("data-id")
            $.get("user/delete?id="+id,function(){
                location.href="user";
            })
        }
    })
</script>

</body>
</html>
